<template>
  <div>
     <c-header :active="type" @changeType="getType"></c-header>
     <div class="title">产品中心-强化复合地板-表面工艺</div>
     <div class="content">
       <h3 class="content-h3">漂亮不止于外观</h3>
       <div class="h4-box">
         <h4>漂亮的地板一定要比看到的还要漂亮。所以 Pergo 强化地板不论外观还是触感，都跟真的一样。</h4>
         <h4 style="margin-top:0.5rem;">我们的产品集合提供了七种不同的表面纹理，每一种都足以增加强化地板的真实感。不论是陈旧的复合的外观，还是木纹的自然感受。我们地板的表面结构也有各种不同的光泽度，来满足更多精心设计的室内风格。无论您要哪种风格，Pergo 地板都可以精致地呈现您想要的特色，甚至更多。</h4>
       </div>
       <div class="img-box">

         <div class="img-box-item">
           <div class="img-item">
             <img src="http://www.pergo.com.cn/sites/default/files/product/1.jpg" alt="">
           </div>
           <h3>GenuineTM 原木 GW</h3>
           <p class="item-text">
             木制结构不明显，每个细节都达到木纹效果，
Sensation 质感系列地板的木纹效果更为突出。可由各种不同的光泽度。
           </p>
         </div>

         <div class="img-box-item">
           <div class="img-item">
             <img src="http://www.pergo.com.cn/sites/default/files/product/2.jpg" alt="">
           </div>
           <h3>GenuineTM 粗糙 GR</h3>
           <p class="item-text">
            木制结构明显，每个细节都达到木纹效果，Pergo Sensation 质感系列地板的木纹效果更为突出。可以有裂缝、虫孔和划痕效果。
           </p>
         </div>

          <div class="img-box-item">
           <div class="img-item">
             <img src="http://www.pergo.com.cn/sites/default/files/product/3.jpg" alt="">
           </div>
           <h3>GenuineTM 锯痕 GC</h3>
           <p class="item-text">
           木制结构逼真，有锯痕效果。
           </p>
         </div>

          <div class="img-box-item">
           <div class="img-item">
             <img src="http://www.pergo.com.cn/sites/default/files/article/genuinestone.jpg" alt="">
           </div>
           <h3>GenuineTM 锯痕 GC</h3>
           <p class="item-text">
          逼真的石砖结构。
           </p>
         </div>

          <div class="img-box-item">
           <div class="img-item">
             <img src="http://www.pergo.com.cn/sites/default/files/article/wood.jpg" alt="">
           </div>
           <h3>原木 WO</h3>
           <p class="item-text">
          纹理精致逼真，不论浅色木材还是深色木材，都能突出各种木制装饰。可有各种不同的光泽度。
           </p>
         </div>

          <div class="img-box-item">
           <div class="img-item">
             <img src="http://www.pergo.com.cn/sites/default/files/article/smooth.jpg" alt="">
           </div>
           <h3>光滑 SO</h3>
           <p class="item-text">
         表面丝般柔滑，触感柔软，具现代感。可有各种不同的光泽度。
           </p>
         </div>

         <div class="img-box-item">
           <div class="img-item">
             <img src="http://www.pergo.com.cn/sites/default/files/article/antiquewood.jpg" alt="">
           </div>
           <h3>仿古木 AW</h3>
           <p class="item-text">
         纹理质朴，具复古感。
           </p>
         </div>

       </div>
     </div>
     
     <c-footer></c-footer>
  </div>
</template>

<script>

  export default {
    name:'',
    props:[''],
    data () {
      return {
        type: this.$route.query.type ? this.$route.query.type : 0,
      };
    },

    components: {},

    computed: {},

    beforeMount() {},

    mounted() {},

    methods: {
       getType(type) {
        this.type = type
      },
    },

    watch: {}

  }

</script>
<style lang='less' scoped>
.content{
  padding: 0.4rem 0.25rem 0.8rem;
  .content-h3{
    text-align: center;
  }
  .h4-box{
    margin-top: 0.45rem;
    // margin-bottom: 0.4rem;
  }
  .img-box{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .img-box-item{
     width: 3.3rem;
     margin-top: 0.35rem;
     h3{
       font-size: 0.3rem;
       margin-top: 0.1rem;
       }
       .item-text{
        //  margin-top: 0.05rem;
         color: #6e6e6e;
         font-size: 0.25rem;
       }
  }
  .img-box{
    .img-item{
      width: 3.3rem;
      height: 3.3rem;
      
      img{
        width: 100%;
        height: 100%;
      }
    }
  }
}
</style>